<template>
  <div class="container">
    <span>{{currentTime}}</span>
  </div>
</template>

<script>
export default {
  components: {
  },
  data() {
    return {
      currentTime:this.formatDate(new Date())
    }
  },
  methods:{
    formatDate(date){
      const year = date.getFullYear();
      const month = (date.getMonth() + 1).toString().padStart(2, '0');
      const day = date.getDate().toString().padStart(2, '0');
      const hours = date.getHours().toString().padStart(2, '0');
      const minutes = date.getMinutes().toString().padStart(2, '0');
      const seconds = date.getSeconds().toString().padStart(2, '0');
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    }
  },
  mounted() {
    setInterval(() => {
      this.currentTime = this.formatDate(new Date())
    }, 1000);
  }

}
</script>
<style lang="less" scoped>
.container {
  
  color: #1adbfb;
  font-size: 37px;
  font-family: electronicFont;
    font-weight: bold;
}
.xiaoshi {
  font-size: 17px;
  color: #163794;
  margin-left: 5px;
  margin-right: 5px;
}
</style>